import { IRootState } from '@/store/types'
import { Module } from 'vuex'
import { ISystemState } from './types'
import { getPageListData, deletePageData } from '@/serivce/main/system/system'
import { IDataType } from '@/serivce/types'

const pageUrlMap: { [key: string]: string } = {
  // 'user': '/vue3user/selectAll',
  'user/list': '/vue3user/listp',
  'user/delete': 'vue3user/delete', //post - 传入参数：{id:123}
  'role/list': '/vue3role/selectAll',
  'menu/list': '/vue3menu/list'
}

/**
 * 2021年9月25日 10:32:12 chanchaw
 * 视频教程中 coderwhy 的说法是如果完全按照菜单的布局为每个菜单项目 - 系统管理下有：用户管理、部门管理、菜单管理、角色管理
 * 商品中心下有：商品类别、商品信息，为防止出现太多模块，教程中采用了一个系统管理采用一个模块。
 */
const systemModule: Module<ISystemState, IRootState> = {
  namespaced: true,
  state() {
    return {
      userList: [],
      userCount: 0,
      roleList: [],
      roleCount: 0,
      menuList: [],
      menuCount: 0
    }
  },
  mutations: {
    changeUserList(state, userList: any[]) {
      state.userList = userList
    },
    changeUserCount(state, userCount: number) {
      state.userCount = userCount
    },
    changeRoleList(state, roleList: any[]) {
      state.roleList = roleList
    },
    changeRoleCount(state, roleCount: number) {
      state.roleCount = roleCount
    },
    changeMenuList(state, menuList: any[]) {
      state.menuList = menuList
    },
    changeMenuCount(state, menuCount: number) {
      state.menuCount = menuCount
    }
  },
  getters: {
    pageListData(state) {
      return (pageName: string) => {
        return (state as any)[`${pageName}List`]
        // switch (pageName) {
        //   case 'user':
        //     return state.userList
        //     break
        //   case 'role':
        //     return state.roleList
        //     break
        // }
      }
    },
    pageListCount(state) {
      return (pageName: string) => {
        return (state as any)[`${pageName}Count`]
      }
    }
  },
  actions: {
    async getPageListAction({ commit }, payload: any) {
      const pageName: string = payload.pageName
      const pageUrl = pageUrlMap[`${pageName}/list`]

      const pageResult: IDataType = await getPageListData(pageUrl, payload.queryInfo)
      const pageList = pageResult.data
      const pageCount = pageResult.data.length ?? 0
      const capitalFirst = pageName.replace(pageName[0], pageName[0].toUpperCase())
      const changeListMethodName = `change${capitalFirst}List`
      const changeCountMethodName = `change${capitalFirst}Count`
      console.log('拼接的方法名称是：', changeListMethodName, changeCountMethodName)
      commit(changeListMethodName, pageList)
      commit(changeCountMethodName, pageCount)
    },

    async deletePageDataAction({ dispatch }, payload: any) {
      const { pageName, id } = payload
      const pageUrl = pageUrlMap[`${pageName}/delete`] // 构建删除请求 url
      await deletePageData(pageUrl, { id: id })

      // 删除数据刷新页面
      dispatch('getPageListAction', {
        pageName,
        queryInfo: {
          offset: 1,
          count: 10
        }
      })
    }
  }
}

export default systemModule
